var urlConsultas = "Consultas_obtenerConsultasPorCliente.action";
var resultData;

function AsignarEventos() {
    $('#areaContenido').empty();
    $('.filtroConsulta').click(function () {
        $(this).closest('li').find(" ~ li.enable").removeClass("enable").addClass("disable");
        $(this).closest('li').find(" + li").removeClass("disable").addClass("enable");
        $('#idOpcion').val("");
        $('#areaContenido').empty();
    });

    $('#buscarOpcion').click(function () {
         obtenerConsultasPorClienteJSONData($('#idOpcion').val(), $('input:checked').val());
    });

    $("#idOpcion").keyup(function(){

        if($(this).val()!=""){
            $(this).closest('li').find(" + li").removeClass("disable").addClass("enable");
        }else{
            $(this).closest('li').find(" ~ li.enable").removeClass("enable").addClass("disable");
        }

    });


}


function obtenerConsultasPorClienteJSONData(data, opt) {
    var url = urlConsultas;
    var ClienteOd = {};
    var objetoJson = [];
    var param = {};


    switch (opt) {
        case "1":
            ClienteOd.empresa = data;
            break;
        case "2":
            ClienteOd.empresa = data;
            break;
    }

    objetoJson[0] = ClienteOd;

    param.objetoJson = JSON.stringify({"clientes": objetoJson});
    sendServiceJSON(url, param, obtenerConsultasPorClienteSuccess, null, null);
}


function obtenerConsultasPorClienteSuccess(originalRequest) {
    //                   this is the json return data
    var result = originalRequest;
    resultData = result.servicios;


    var areaContenido = $('#resultados');
    areaContenido.empty();
    areaContenido.removeClass("disable").addClass("enable");

    var ul = $(document.createElement('ul')).appendTo(areaContenido);
    ul.addClass("ul_resultado");
    $.each(resultData, function (i, item) {
        var li = $(document.createElement('li')).appendTo(ul);
        var a = $('<a></a>').appendTo(li);
        a.attr('href', '#' + i);
        a.html(item.nombre);
        /*var im = $('<img />').appendTo(a);
         im.attr('src', "resources/images/user_check.png");*/
        var anOpen = [];

        a.click(function (event) {
            event.preventDefault();


            var liSup = this.parentNode;
            var i = $.inArray(liSup, anOpen);

            if (i === -1) {

                var index = (this.href.substr(this.href.search("#") + 1));
                var subServicioPrimerNivel = resultData[index].subServicios;

                var ulInt = $(document.createElement('ul')).appendTo(liSup);
                ulInt.addClass('ulInt');
                $.each(subServicioPrimerNivel, function (i2, item2) {
                    var li = $(document.createElement('li')).appendTo(ulInt);
                    var a2 = $('<a></a>').appendTo(li);
                    a2.attr('href', '#' + i2);
                    a2.html(item2.nombre);
                    a2.click(function (event) {
                        event.preventDefault();

                        var index = (this.href.substr(this.href.search("#") + 1));
                        //var subServicioSegundoNivel = subServicioPrimerNivel[index].subServicios;
                        llenarTabla(index, subServicioPrimerNivel);

                    });

                });

                anOpen.push(liSup);
            }
            else {
                $(liSup).children('ul.ulInt').remove();
                anOpen.splice(i, 1);

            }



        });



    });



}


function llenarTabla(index, servicios) {
    var areaContenido = $('#areaContenido');
    areaContenido.empty();

    var tableInt = $('<table></table>').appendTo(areaContenido);
    var thead = $(document.createElement('thead')).appendTo(tableInt);
    var tr = $(document.createElement('tr')).appendTo(thead);
    var th = $(document.createElement('th')).appendTo(tr);
    var th = $(document.createElement('th')).appendTo(tr);
    th.html('Servicio');
    var tbody = $(document.createElement('tbody')).appendTo(tableInt);

    $.each(servicios[index].subServicios, function (i, item) {
        var trBody = $(document.createElement('tr')).appendTo(tableInt);
        var tdMas = $('<td></td>').appendTo(trBody);
        tdMas.addClass('cerrado');
        var ain = $('<a></a>').appendTo(tdMas);
        ain.attr('href', '#' + i);

        ain.html("+");

        /*var im = $('<img />').appendTo(a);
        im.attr('src', "resources/images/verMas.png");*/

        ain.click(function (event) {
            event.preventDefault();
        });

        var anOpen = [];
       tdMas.click(function () {
            var nTr = this.parentNode;
            var ind = $.inArray(nTr, anOpen);

            if ($(this).hasClass('cerrado')) {
                var hlink = this.childNodes;
                var hre = hlink[0].href;
                var indiDatos = hre.substr(hre.search("#") + 1);
                var det = servicios[index].subServicios[indiDatos];

                fnFormatDetailsParaCambiar(det, oTable, nTr);

                $(hlink[0]).html("-");
                $(this).removeClass('cerrado');
                $(this).addClass('abierto');
            }
            else {
                $((this.childNodes)[0]).html("+");
                $(this).removeClass('abierto');
                $(this).addClass('cerrado');
                $('div.innerDetails', $(nTr).next()[0]).slideUp(function () {
                    oTable.fnClose(nTr);
                });
            }

        });


        var td = $('<td></td>').appendTo(trBody);
        td.html(item.nombre + '(' + item.subServicios.length + ')');


    });


    var oTable = tableInt.dataTable({
        "bDestroy": true,
        "bJQueryUI": true,
        "bFilter": true,
        "bPaginate": true,
        "bSort": true,
        "oLanguage": {
            "sZeroRecords": "No Hay Informaci&oacute;n",
            "sInfo": "",
            "sInfoEmpty": ""
        }
    });

}

/*function fnFormatDetails(aData, res) {
 var innerDetails = $('<div class="innerSubDetails"></div>');
 var tableInt = $('<table class="singleTable"></table>').appendTo(innerDetails);
 var lengthRes = aData[1].length;
 var k = 1;
 var tHeadInt = $('<thead></thead>').appendTo(tableInt);
 var tableTrHe = $('<tr></tr>').appendTo(tHeadInt);
 $.each(res, function (i, item) {
 var th = $('<th></th>').appendTo(tableTrHe);
 th.html(item);
 });

 for (var j = 0; j < lengthRes; j++) {
 if (k > res.length || j == 0) {
 k = 1;
 var trTableInt = $('<tr></tr>').appendTo(tableInt);
 }
 var subTd2 = $('<td></td>').appendTo(trTableInt);
 var str = aData[1][j];
 str = str.substring(str.search("]") + 1);
 subTd2.append(str);
 k++;

 }

 var sOut = '<div class="innerSubDetails">' + innerDetails.html() + '</div>';
 return sOut;
 }  */

function fnFormatDetailsParaCambiar(detalle, oTable, nTrPrincipal) {

    var innerDetails = $('<div class="innerDetails"></div>');
    var tableInt = $('<table class="subSingleTable"></table>').appendTo(innerDetails);
    var thead = $(document.createElement('thead')).appendTo(tableInt);
    var tr = $(document.createElement('tr')).appendTo(thead);
    var th = $(document.createElement('th')).appendTo(tr);
    th.html('Nombre');
    var th = $(document.createElement('th')).appendTo(tr);
    th.html('Direccion IP');
    var th = $(document.createElement('th')).appendTo(tr);
    th.html('Ubicacion');
    var tbody = $(document.createElement('tbody')).appendTo(tableInt);

    $.each(detalle.subServicios, function (i, item) {
        var trBody = $(document.createElement('tr')).appendTo(tableInt);
        var td = $('<td></td>').appendTo(trBody);
        td.html(item.nombre);
        var td = $('<td></td>').appendTo(trBody);
        td.addClass("center");
        td.html(item.dirIP);
        var td = $('<td></td>').appendTo(trBody);
        td.html(item.ubicacion);
        td.addClass("center");

    });

    var nDetailsRow = oTable.fnOpen(nTrPrincipal, innerDetails, 'details');
    $('div.innerDetails', nDetailsRow).slideDown();

}


function crearTabla(encabezados, datos, idTabla){

}
